<!doctype html>
<html>
    <meta charset="utf-8" />
    <style>
        html,
        body {
            margin: 0;
            padding: 0;
            height: 100vh;
            width: 100vw;
            overflow: hidden;
        }
    </style>
    <body>
        <script src="https://unpkg.com/d3@7.9.0/dist/d3.min.js"></script>
        <script src="https://unpkg.com/@hpcc-js/wasm@2.22.4/dist/graphviz.umd.js"></script>
        <script src="https://unpkg.com/d3-graphviz@5.6.0/build/d3-graphviz.js"></script>
        <div id="graph"></div>
        <script type="module" read>
            const response = await fetch("graph");
            const dot = await response.text();

            const { width, height } = window.visualViewport;
            d3.select("#graph").graphviz({ width, height }).renderDot(dot);
        </script>
    </body>
</html>
